import React from 'react';

import router from '../../../utils/routerDecorator';
import {get, post} from '../../../logic/api';
import ObjectList from '../../components/ObjectList';

import QiniuUploadimage from '../../components/QiniuUploadimage';

import styles from './main.less';

import Edit from './Edit';
import Del from './Del';

@router('/site/custom')
export default class Cates extends React.Component {
  
  state = {

  }

  genColumns(){

  }

  async fetchData(current, pageSize, filters, sorter){
    var ret = await get('/admin/custom/list/' + current + "/" + pageSize);
    console.log(ret);
    return ret;
  }

  genColumns(){
    return [
      {title:'中文名称', dataIndex:'cname', width:'20%'},
      {title:'英文名称', dataIndex:'ename', width:'20%'},
      {title:'图片', dataIndex:'image', width:'30%', render:(hash)=>{
        return hash?<img src = {"http://oalpta27j.bkt.clouddn.com/"+hash} style ={{width:50}}/>:<div/>
      }},
      {title:<div>
          <span>操作</span>
          <Edit record = {{
            id:0,
            type:'custom'
          }} text = '新建定制' reload = {()=>{ObjectList.Emitter.emit("reload");}} fetchData = {()=>{
            return {
              data:{
                ename:"",
                cname:"",
                describe:"",
                image:""
              }
            }
          }}/> 
        </div>, render:(t, record)=>{

        return <div className = {styles.operations}>
          <Edit record = {record} text = "编辑" reload = {()=>{ObjectList.Emitter.emit("reload");}}/>
          <Del record = {record} reload = {()=>{ObjectList.Emitter.emit("reload");}}/>
          {record.type === 'custom'?
            <Edit record = {{
              id:0,
              type:'step',
              customId:record.id
            }} text = '新建步骤' reload = {()=>{ObjectList.Emitter.emit("reload");}} fetchData = {()=>{
              return {
                data:{
                  ename:"",
                  cname:"",
                  describe:""
                }
              }
            }}/>:record.type === 'step'?
            <Edit record = {{
              id:0,
              type:'stepcontent',
              customstepId:record.id
            }} text = '新建内容' reload = {()=>{ObjectList.Emitter.emit("reload");}} fetchData = {()=>{
              return {
                data:{
                  ename:"",
                  cname:"",
                  image:""
                }
              }
            }}/>:<div/>
          }
        </div>

      }}
    ]
  }

  render(){
    return <div>
      <ObjectList 
        columns = {this.genColumns()}
        fetchData = {this.fetchData}
      />
    </div>
  }

}